<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div id="root"></div>
</body>
<script type="module" src="./main.jsx"></script>
<script>
    /**
     * 处理跳过低优先级赛道
     * @param hook
     * @param update
     */
    function enqueueUpdate(hook,update){
        let pendingUpdate=hook.queue.pending
        if(!pendingUpdate){
            update.next=update
        }else{
            update.next=pendingUpdate.next
            pendingUpdate.next=update
        }
        hook.queue.pending=update
    }
    function updateReducer(hook,lean){
        if(hook.baseQueue){
            if(hook.queue.pending){
                let firstHook=hook.baseQueue.next
                hook.baseQueue.next=hook.queue.pending.next
                hook.queue.pending.next=firstHook
                hook.baseQueue=hook.queue.pending
            }
        }else{
            hook.baseQueue=hook.queue.pending
        }
        hook.queue.pending=null
        let update=hook.baseQueue
        let currentBaseQueue=null
        if(update){
            let newState=hook.baseState || ''
            let firstUpdate=update.next
            update.next=null
            while (firstUpdate){
                if(firstUpdate.lean<=lean){
                    if(currentBaseQueue){
                        let clone={
                            ...firstUpdate,
                            lean:0,
                            next:null
                        }
                        clone.next=currentBaseQueue.next
                        currentBaseQueue.next=clone
                        currentBaseQueue=clone
                    }
                    newState+=firstUpdate.action
                }else{
                    let clone={
                        ...firstUpdate,
                        next:null
                    }
                    //第一次进入
                    if(!currentBaseQueue){
                        hook.baseState=newState
                        clone.next=clone
                    }else{
                        clone.next=currentBaseQueue.next
                        currentBaseQueue.next=clone
                    }
                    currentBaseQueue=clone
                }
                firstUpdate=firstUpdate.next
            }
            if(currentBaseQueue){
                hook.baseQueue=currentBaseQueue
            }else {
                hook.baseQueue=null
                hook.baseState=''
            }
            hook.memoizeState=newState
        }
    }
    let hook={
        baseState:null,
        baseQueue:null,
        memoizeState:'',
        queue:{
            pending:null,
        }
    }
    let update1={
        action:'t',
        lean:1,
        next:null
    }
    enqueueUpdate(hook,update1)
    let update2={
        action:'w',
        lean:2,
        next:null
    }
    enqueueUpdate(hook,update2)
    let update3={
        action:'t',
        lean:1,
        next:null
    }
    enqueueUpdate(hook,update3)
    let update4={
        action:'t',
        lean:1,
        next:null
    }
    enqueueUpdate(hook,update4)
    updateReducer(hook,1)
    console.log(hook)
    updateReducer(hook,2)
    console.log(hook)
</script>
</html>